<div class="row">
	<div class="col-md-12">
		<div class="row">
			<gvisualization:lineCoreChart 
				elementId="maintenanceLinechart" 
				width="${400}" 
				height="${240}"
				title="${message(code: 'vehicle.maintenance.chart.title', default: 'price trends')}"
				columns="${maintenanceChartData.cols}" 
				data="${maintenanceChartData.datas}" />
			<div id="maintenanceLinechart" class="chartArea"></div>
			
			<div class="statArea">
				<ol>
					<li class="statLine">
						<span class="statLabel"><g:message code="stats.maintenance.cost.average" default="Price average" /></span>
						<span class="statLabel">${maintenanceStatsData.costsAvg}</span>
					</li>
					<li class="statLine">
						<span class="statLabel"><g:message code="stats.maintenance.date.average" default="Date average" /></span>
						<span class="statLabel">${maintenanceStatsData.datesAvg}</span>
					</li>
					<li class="statLine">
						<span class="statLabel"><g:message code="stats.maintenance.mileage.average" default="Mileage average" /></span>
						<span class="statLabel">${maintenanceStatsData.mileagesAvg}</span>
					</li>
					<li class="statLine">
						<span class="statLabel"><g:message code="stats.maintenance.nextMaintenance" default="Next maintenance" /></span>				
						<g:if test="${maintenanceStatsData?.nextMaintenance?.before(new Date()) }">
							<span class="statLabel datePassed"><g:formatDate format="yyyy-MM-dd" date="${maintenanceStatsData.nextMaintenance}"/></span>
						</g:if>
						<g:else>
							<span class="statLabel"><g:formatDate format="yyyy-MM-dd" date="${maintenanceStatsData.nextMaintenance}"/></span>
						</g:else>
						
					</li>
				</ol>
			</div>
		</div>
	</div>
</div>